{% extends "base.html" %}

{% block container_class_name %}profile{% endblock %}

{% block container %}

<div class="subhead">
  <div class="container">
    <h2 class="heading">{{ gsuser.username }}</h2>
  </div>
</div>

<div class="content">

  <div class="container">


    <header class="header">
      <p id="userAlert" class="alert alert-error hide"><strong>你妈了个逼的,加载失败!</strong><span id="alertMessage"></span></p>
      <div class="bios">
        <figure class="avatar">
          <img src="https://gravatar.com/avatar/{{ gsuserprofile.imgurl }}?s=120" alt="{{ gsuser.username }}">
        </figure>
        <div class="details">
          <h2 class="heading name">{{ gsuser.username }}
            {% if gsuserprofile.nickname %}({{ gsuserprofile.nickname }}){% endif %}
            <span>{{ gsuserprofile.tweet }}</span>
          </h2>
          <dl class="infos">
            {% if gsuserprofile.website %}
              <dt class="leader"><i class="icon-link"></i></dt>
              <dd><a href="{{ gsuserprofile.website }}" target="_blank">{{ gsuserprofile.website }}</a></dd>
            {% endif %}
            {% if gsuserprofile.company %}
              <dt class="leader"><i class="icon-laptop"></i></dt>
              <dd>{{ gsuserprofile.company }}</dd>
            {% endif %}
            {% if gsuserprofile.location %}
              <dt class="leader"><i class="icon-location-arrow"></i></dt>
              <dd>{{ gsuserprofile.location }}</dd>
            {% endif %}
            <dt class="leader"><i class="icon-compass"></i></dt>
            <dd>{{ gsuserprofile.create_time|date:"Y-m-d" }}</dd>
          </dl>
          
          {% if user.username != gsuser.username %}
            {% if not is_watched_user %}
              <a id="watchUser" class="btn follow-btn" href="javascript: void(0)">关注他/她</a>
            {% else %}
              <a id="unwatchUser" class="btn follow-btn" href="javascript: void(0)">取消关注</a>
            {% endif %}
          {% endif %}
        </div>
      </div>
      {% comment %}
        <ul class="meta horizontal-list">
          <li class="first">
            {% if user.username == gsuser.username %}
              <a href="/{{ gsuser.username }}/repo/">{{ gsuserprofile.pubrepo|add:gsuserprofile.prirepo }}</a>
            {% else %}
              <a href="/{{ gsuser.username }}/repo/">{{ gsuserprofile.pubrepo }}</a>
            {% endif %}
              <span class="muted">仓库</span>
          </li>
          <li>
            <a href="/{{ gsuser.username }}/-/watch/repo/">{{ gsuserprofile.watchrepo }}</a>
            <span class="muted"><i class="icon-heart-empty"></i>关注仓库</span>
          </li>
          <li>
            <a href="/{{ gsuser.username }}/-/watch/user/">{{ gsuserprofile.watch }}</a>
            <span class="muted"><i class="icon-user"></i>关注</span>
          </li>
          <li>
            <a href="/{{ gsuser.username }}/-/watch/user/">{{ gsuserprofile.be_watched }}</a>
            <span class="muted"><i class="icon-group"></i>粉丝</span>
          </li>
        </ul>
      {% endcomment %}
    </header>

    {% block primary %}{% endblock %}
    {% block sidebar %}{% endblock %}

    {% comment %}
    {% if show_common %}
      <aside class="sidebar span">
          {% if gsuserprofile.resume %}
          <section id="id_user_resume" class="item">
              <h2 class="heading">简历:</h2>
              <div id="id_user_resume_content" class="well">{{ gsuserprofile.resume }}</div>
          </section>
          {% endif %}
          <section id="id_user_recommends" class="item">
                  <h2 class="heading">评论:<a href="/{{gsuser.username}}/recommend/" class="more">more</a></h2>
                  {% for recommend in recommends %}
                          <span>{{recommend.content}}</span>
                          <small><a href="/{{recommend.username}}/">{{recommend.username}}</a> {{recommend.tweet}}</small>
                  {% endfor %}
                  <form class="form-inline" action="/{{user.username}}/recommend/" method="post">
                          {% csrf_token %}
                          {{ recommendsForm.content }}
                          <button id="id_recommend_submit" class="btn btn-mini hide" type="submit">确定</button>
                  </form>
          </section>
          <section class="item">
              <h2 class="heading">关注<a href="/{{gsuser.username}}/-/watch/user/" class="more">more</a></h2>
              <div class="colspan">
                  {% for watch_user in watch_users %}
                  <a href="/{{watch_user.username}}/" class="span user-span" data-toggle="popover" title="{{ watch_user.username }}" data-content="{% if tweet != "" %}{{ watch_user.tweet }}{% else %}这家伙真懒{%endif%}">
                    <img src="https://gravatar.com/avatar/{{watch_user.imgurl}}?s=32" alt="{{watch_user.username}}">
                  </a>
                  {% endfor %}
              </div>
          </div>
          <div class="item">
              <h2 class="heading">被关注<a href="/{{gsuser.username}}/-/watch/user/" class="more">more</a></h2>
              <div class="colspan">
                  {% for bewatch_user in bewatch_users %}
                  <a href="/{{bewatch_user.username}}/" class="span user-span" data-toggle="popover" title="{{ bewatch_user.username }}" data-content="{{ bewatch_user.tweet }}">
                    <img src="https://gravatar.com/avatar/{{bewatch_user.imgurl}}?s=32" alt="{{bewatch_user.username}}">
                  </a>
                  {% endfor %}
              </div>
          </div>

      </div>
      {% endif %}
    {% endcomment %}

    {% block row_sub_container %}{% endblock %}


  </div>
</div>

{% endblock %}

{% block js %}
<script>
$(function(){
    var disabled_watch = false;
    $('#watchUser').click(function() {
        if(disabled_watch) {
            return false;
        }
        disabled_watch = true;
        $.ajax({
            url: '/ajax/user/watch/{{ gsuser.username }}/',
            type: 'POST',
            data: {csrfmiddlewaretoken: '{{ csrf_token }}'},
            dataType: 'json',
            timeout: 10000,
            error: function(){
                disabled_watch = false;
                $('#userAlert').show();
                $('#alertMessage').html('网络原因，请求失败，请刷新再次尝试');
            },
            success: function(json){
                if(json.result == 'success') {
                    window.location = window.location
                    return true;
                }
                $('#userAlert').show();
                $('#alertMessage').html(json.message);
            },
        })
    })
    $('#unwatchUser').click(function() {
        if(disabled_watch) {
            return false;
        }
        disabled_watch = true;
        $.ajax({
            url: '/ajax/user/unwatch/{{ gsuser.username }}/',
            type: 'POST',
            data: {csrfmiddlewaretoken: '{{ csrf_token }}'},
            dataType: 'json',
            timeout: 10000,
            error: function(){
                disabled_watch = false;
                $('#userAlert').show();
                $('#alertMessage').html('网络原因，请求失败，请刷新再次尝试');
            },
            success: function(json){
                if(json.result == 'success') {
                    window.location = window.location
                    return true;
                }
                $('#userAlert').show();
                $('#alertMessage').html(json.message);
            },
        })
    });

});
</script>
    {% block subjs %}{% endblock %}
{% endblock %}
